"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
const global_1 = require("../../../config/global");
const core_1 = require("@logicflow/core");
function registerConvFlowNode(lf) {
    lf.register('convFlowNode', ({ RectNode, RectNodeModel, h }) => {
        class Node extends RectNode {
            getTitleElement() {
                const { model } = this.props;
                const { x, y } = model;
                const style = model.getNodeStyle();
                const properties = model.getProperties();
                if (properties.convFlowList) {
                    // 创建一个文本输入框
                    return h("g", {}, [
                        h('text', {
                            fill: '#000000',
                            fontSize: 16,
                            x: x - 70,
                            y: y - 25 - 35 * properties.convFlowList.length,
                            width: 50,
                            height: 25
                        }, 'CC_ConvFlowNode'),
                    ]);
                }
            }
            ;
            getLabelShape() {
                const { model } = this.props;
                const { x, y } = model;
                const nodeData = model.getData();
                const style = model.getNodeStyle();
                const properties = model.getProperties();
                return h('g', {}, [
                    h('text', {
                        fill: '#000000',
                        fontSize: 12,
                        x: x - 140,
                        y: y + 5 - 35 * properties.convFlowList.length,
                        width: 50,
                        height: 25
                    }, 'Name:'),
                    h("foreignObject", Object.assign(Object.assign({}, style), { id: "convFlow11", type: "convFlow11", height: 22, width: 90, y: y - 10 - 35 * properties.convFlowList.length, x: x - 100 }), [
                        h("textarea", {
                            style: {
                                width: "70%",
                                height: "70%",
                                resize: "none" // 禁止调整文本框大小
                            },
                            value: properties.roleName,
                            onInput: (event) => {
                                let newContent = event.target.value;
                                properties.currentConvFlow.role_name = newContent;
                                properties.convFlowList.forEach(element => {
                                    element.role_name = newContent;
                                });
                                model.setProperties(properties);
                            },
                        })
                    ]),
                    h('text', {
                        fill: '#000000',
                        fontSize: 12,
                        x: x - 20,
                        y: y + 5 - 35 * properties.convFlowList.length,
                        width: 50,
                        height: 25
                    }, 'ID:'),
                    h("foreignObject", Object.assign(Object.assign({}, style), { id: "convFlow11", type: "convFlow11", height: 22, width: 90, y: y - 10 - 35 * properties.convFlowList.length, x: x }), [
                        h("textarea", {
                            style: {
                                width: "70%",
                                height: "70%",
                                resize: "none" // 禁止调整文本框大小
                            },
                            value: properties.roleID,
                            onInput: (event) => {
                                let newContent = event.target.value;
                                properties.currentConvFlow.role_id = newContent;
                                properties.convFlowList.forEach(element => {
                                    element.role_id = newContent;
                                });
                                model.setProperties(properties);
                            },
                        })
                    ]),
                    h("foreignObject", Object.assign(Object.assign({}, style), { id: "rolePos_select", type: "rolePos", height: 25, width: 50, y: y - 10 - 35 * properties.convFlowList.length, x: x + 90 }), [
                        h("select", {
                            style: {
                                width: "100%",
                                height: "100%",
                            },
                            value: properties.rolePos,
                            // value: nodeData.properties.rolePos ? "右": '左',
                            onChange: (event) => {
                                properties.rolePos = event.target.value;
                                console.log("修改值", properties.rolePos);
                                model.setProperties(properties);
                                nodeData.properties.rolePos = event.target.value;
                            },
                        }, [
                            h("option", {
                                value: false,
                                selected: nodeData.properties.rolePos === false,
                            }, "左"),
                            h("option", {
                                value: true,
                                selected: nodeData.properties.rolePos === true,
                            }, "右"),
                        ])
                    ])
                ]);
            }
            getAllconvFlowList() {
                const { model } = this.props;
                const { width, height, x, y, } = model;
                const style = model.getNodeStyle();
                const nodeData = model.getData();
                const properties = model.getProperties();
                const { stroke } = model.getNodeStyle();
                if (properties.convFlowList) {
                    // 遍历convFlowList并创建对应的h("rect")元素
                    const convFlowElements = properties.convFlowList.map((convFlow, index) => {
                        // 在这里可以根据convFlow对象的属性来设置rect元素的属性
                        if (convFlow.role_pic != '' && convFlow.role_pic) {
                            return h("g", {}, [
                                h("foreignObject", Object.assign(Object.assign({}, style), { id: "convFlow", type: "convFlow", height: 80, width: 210, y: y + 20 - 35 * properties.convFlowList.length + 70 * index, x: x - 65 }), [
                                    h("textarea", {
                                        style: {
                                            width: "95%",
                                            height: "70%",
                                            resize: "none" // 禁止调整文本框大小
                                        },
                                        value: properties.convFlowList[index].convFlow_content,
                                        onInput: (event) => {
                                            let newContent = event.target.value;
                                            properties.convFlowList[index].convFlow_content = newContent;
                                            model.setProperties(properties);
                                        },
                                    }),
                                ]),
                                h("rect", Object.assign(Object.assign({}, style), { id: index, type: "role", height: 60, width: 65, y: y + 20 - 35 * properties.convFlowList.length + 70 * index, x: x - 140, onClick: (event) => {
                                        model.graphModel.eventCenter.emit("openConvFlowRole", {
                                            nodeData,
                                            index
                                        });
                                    } })),
                                h('image', {
                                    id: 'image01',
                                    x: x - 130,
                                    y: y + 25 - 35 * properties.convFlowList.length + 70 * index,
                                    width: 50,
                                    height: 50,
                                    href: convFlow.role_pic,
                                    onClick: (event) => {
                                        const boxPos = false;
                                        model.graphModel.eventCenter.emit("openConvFlowRole", {
                                            nodeData,
                                            index
                                        });
                                    },
                                })
                            ]);
                        }
                        else {
                            return h("g", {}, [
                                h("foreignObject", Object.assign(Object.assign({}, style), { id: "convFlow", type: "convFlow", height: 80, width: 210, y: y + 20 - 35 * properties.convFlowList.length + 70 * index, x: x - 65 }), [
                                    h("textarea", {
                                        style: {
                                            width: "95%",
                                            height: "70%",
                                            resize: "none" // 禁止调整文本框大小
                                        },
                                        value: properties.convFlowList[index].convFlow_content,
                                        onInput: (event) => {
                                            let newContent = event.target.value;
                                            properties.convFlowList[index].convFlow_content = newContent;
                                            model.setProperties(properties);
                                        },
                                    }),
                                ]),
                                h("rect", Object.assign(Object.assign({}, style), { id: index, type: "role", height: 60, width: 65, y: y + 20 - 35 * properties.convFlowList.length + 70 * index, x: x - 140, onClick: (event) => {
                                        model.graphModel.eventCenter.emit("openConvFlowRole", {
                                            nodeData,
                                            index
                                        });
                                    } })),
                                h('svg', {
                                    x: x - 130,
                                    y: y + 20 - 35 * properties.convFlowList.length + 70 * index,
                                    width: 50,
                                    height: 50,
                                    viewBox: '0 0 1126 1024',
                                }, h('path', {
                                    fill: stroke,
                                    d: 'M652.8 534.4C723.2 489.6 768 409.6 768 320c0-140.8-115.2-256-256-256S256 179.2 256 320c0 89.6 44.8 169.6 115.2 214.4C192 592 64 761.6 64 960h64c0-211.2 172.8-384 384-384s384 172.8 384 384h64c0-198.4-128-368-307.2-425.6zM512 512c-105.6 0-192-86.4-192-192s86.4-192 192-192 192 86.4 192 192-86.4 192-192 192z'
                                }))
                            ]);
                        }
                    });
                    // 返回包含所有convFlow元素的SVG
                    return h("g", {}, convFlowElements);
                }
                return null; // 如果没有convFlow数据则返回null或其他默认值
            }
            getLocIconShape() {
                const { model } = this.props;
                const { x, y } = model;
                const { stroke } = model.getNodeStyle();
                const nodeData = model.getData();
                const properties = model.getProperties();
                properties.convFlowList.map((convFlow, index) => {
                    if (convFlow.role_pic != '') {
                        return h('image', {
                            id: 'image01',
                            x: x - 100,
                            y: y - 65,
                            width: 50,
                            height: 50,
                            href: convFlow.role_pic, // 使用图片地址
                        });
                    }
                });
            }
            getShape() {
                const { model } = this.props;
                const { width, height, x, y, } = model;
                const style = model.getNodeStyle();
                const properties = model.getProperties();
                if (properties.convFlowList) {
                    return h("g", {}, [
                        h("rect", Object.assign(Object.assign({}, style), { id: "svg_1", height: 80 + 70 * properties.convFlowList.length, width: 300, x: x - 300 / 2, y: y - 35 - 35 * properties.convFlowList.length, fill: "#fdfd19" })),
                        h("rect", Object.assign(Object.assign({}, style), { id: "svg_7", height: 30, width: 300, x: x - 300 / 2, y: y - 35 - 10 - 35 * properties.convFlowList.length })),
                        this.getLabelShape(),
                        this.getTitleElement(),
                        this.getAllconvFlowList(),
                        this.getChangeList(),
                    ]);
                }
            }
            getChangeList() {
                const { model } = this.props;
                const { width, height, x, y, } = model;
                const style = model.getNodeStyle();
                const textStyle = model.getTextStyle();
                const { stroke } = model.getNodeStyle();
                const nodeData = model.getData();
                const properties = model.getProperties();
                if (properties.convFlowList) {
                    return h("g", {}, [
                        h("rect", Object.assign(Object.assign({}, style), { id: "add", type: "add", height: 16, width: 100, y: y + 18 + 35 * properties.convFlowList.length, x: x - 102, fill: "#e8c9b5", onClick: (event) => {
                                let newconvFlow = new global_1.convFlow('', '', '', global_1.GraphRes.getNextId(), '');
                                if (nodeData.properties.currentConvFlow) {
                                    console.log("currentConvFlow对话节点", nodeData.properties.currentConvFlow);
                                    newconvFlow.role_id = nodeData.properties.currentConvFlow.role_id;
                                    newconvFlow.role_name = nodeData.properties.currentConvFlow.role_name;
                                    newconvFlow.role_pic = nodeData.properties.currentConvFlow.role_pic;
                                }
                                nodeData.properties.convFlowList.push(newconvFlow);
                                // 获取当前的Model实例
                                nodeData.text.y += 40;
                                model.initNodeData(nodeData);
                                model.addField();
                            } })),
                        h("svg", {
                            x: x - 60,
                            y: y + 18 + 35 * properties.convFlowList.length,
                            width: 15,
                            height: 15,
                            viewBox: '0 0 1126 1024',
                        }, h('path', {
                            fill: stroke,
                            d: 'M801.171 483.589H544V226.418c0-17.673-14.327-32-32-32s-32 14.327-32 32v257.171H222.83c-17.673 0-32 14.327-32 32s14.327 32 32 32H480v257.17c0 17.673 14.327 32 32 32s32-14.327 32-32v-257.17h257.171c17.673 0 32-14.327 32-32s-14.327-32-32-32z'
                        })),
                        h("rect", Object.assign(Object.assign({}, style), { id: "substract", type: "substract", height: 16, width: 100, y: y + 18 + 35 * properties.convFlowList.length, x: x + 5, fill: "#e8c9b5", onClick: (event) => {
                                if (nodeData.properties.convFlowList.length > 1) {
                                    nodeData.properties.convFlowList.pop();
                                    nodeData.text.y -= 40;
                                    model.initNodeData(nodeData);
                                    model.addField();
                                }
                            } })),
                        h("svg", {
                            x: x + 50,
                            y: y + 18 + 35 * properties.convFlowList.length,
                            width: 15,
                            height: 15,
                            viewBox: '0 0 1126 1024',
                        }, h('path', {
                            fill: stroke,
                            d: 'M801.171 547.589H222.83c-17.673 0-32-14.327-32-32s14.327-32 32-32h578.341c17.673 0 32 14.327 32 32s-14.327 32-32 32z'
                        })),
                    ]);
                }
            }
        }
        class Model extends RectNodeModel {
            constructor(data, graphModel) {
                data.text = {
                    value: (data.text && data.text.value) || '未命名节点-对话流',
                    x: data.x,
                    y: data.y + 100
                };
                super(data, graphModel);
                this.radius = 20;
            }
            initNodeData(data) {
                if (!data.virtual && !data.properties) {
                    const convFlow = new global_1.ConvFlowNode();
                    data.properties = Object.assign({}, convFlow);
                    this.width = 300;
                    this.height = 160;
                }
                super.initNodeData(data);
                if (data.properties && data.properties.convFlowList) {
                    this.width = 300;
                    this.height = 90 + 70 * data.properties.convFlowList.length;
                }
                const onlyPosAsConnect = {
                    message: "连接对应的锚点",
                    validate: (sourceNode, targetNode, sourceAnchor, targetAnchor) => {
                        return sourceAnchor.type === 'right' && targetAnchor.type === 'left';
                    },
                };
                this.sourceRules.push(onlyPosAsConnect);
            }
            addField() {
                this.setAttributes();
                // 为了保持节点顶部位置不变，在节点变化后，对节点进行一个位移,位移距离为添加高度的一半。
                this.move(0, 24 / 2);
                // 更新节点连接边的path
                this.incoming.edges.forEach((egde) => {
                    // 调用自定义的更新方案
                    egde.updatePathByAnchor();
                });
                this.outgoing.edges.forEach((edge) => {
                    // 调用自定义的更新方案
                    edge.updatePathByAnchor();
                });
            }
            // 自定义节点样式属性
            getNodeStyle() {
                const style = super.getNodeStyle();
                return style;
            }
            // 自定义节点outline
            getOutlineStyle() {
                const style = super.getOutlineStyle();
                style.stroke = '#88f';
                return style;
            }
            getAnchorStyle(anchorInfo) {
                const style = super.getAnchorStyle(anchorInfo);
                if (anchorInfo.type === "left") {
                    style.fill = "red";
                    style.hover.fill = "transparent";
                    style.hover.stroke = "transpanrent";
                    style.className = "lf-hide-default";
                }
                else {
                    style.fill = "green";
                    style.r = 10;
                    style.hover.r = 15;
                }
                return style;
            }
            setIsShowAnchor() {
                this.isShowAnchor = true;
            }
            getDefaultAnchor() {
                const { width, height, x, y, id } = this;
                const anchors = [];
                return [{
                        x: x + 20 - width / 2,
                        y: y - 30 - 35 * this.properties.convFlowList.length,
                        type: "left",
                        edgeAddable: false,
                        id: `${id}_0`,
                    },
                    {
                        x: x - 18 + width / 2,
                        y: y - 30 - 35 * this.properties.convFlowList.length,
                        type: "right",
                        id: `${id}_1`,
                    },
                ];
            }
        }
        return {
            view: Node,
            model: Model
        };
    });
}
exports.default = registerConvFlowNode;
